<template>
  <div style="margin-top: 100px">
    <el-row>
      <el-col :span="8">&nbsp;</el-col>
      <el-col :span="8">
        <el-card shadow="always" header="退出登录">
          <el-form ref="form" :model="model" label-width="100px">
            <el-form-item>

              {{model.name}}，你确定要退出吗？

            </el-form-item>

            <el-form-item label="">
              <el-button type="primary" round @click="logout()">
                确 定
              </el-button>
              <el-button type="warning" round @click="$router.go(-1)">
                取 消
              </el-button>
            </el-form-item>
          </el-form>

        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import LoginModel from '@/domain/Login.js'

export default {
  name: 'Welcome',
  data () {
    return {
      model: new LoginModel()
    }
  },
  methods: {
    logout: async function () {
      let error = await this.model.logout()
      let _this = this
      this.showError(error, function () {
        _this.$bus.emit('loginStatusChanged')
        _this.$router.replace('/')
      })
    },
    showError: function (error, success) {
      if (error) {
        this.$message.error(error)
        return
      }
      this.$message.success('退出登录成功')
      if (success) success()
    }
  },
  mounted: async function () {
    await this.model.getLogin()
  }
}
</script>
